<template>
	<div class="column-wrap">
		<Search />
		<ColumnTree v-if="showType == 1" />
		<JournalTree v-if="showType == 2" />
		<Add />
		<AddSource />
	</div>
</template>
<script>
export default {
	components: {
		Search: () => import('./Search.vue'),
		ColumnTree: () => import('./ColumnTree.vue'),
		JournalTree: () => import('./JournalTree.vue'),
		Add: () => import('./Add.vue'),
		AddSource: () => import('./AddSource.vue')
	},
	data() {
		return {
			showType: 1
		};
	},
	watch: {
		$route: {
			immediate: true,
			handler(val) {
				let { showType } = val.meta;
				this.showType = showType;
			}
		}
	}
};
</script>
<style scoped>
.column-wrap {
	position: relative;
	height: 100%;
}
</style>
